<%@ page contentType="text/html;charset=UTF-8" language="java" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="/struts-tags" prefix="s" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <link href="//cdn.bootcss.com/jqueryui/1.11.3/jquery-ui.min.css" rel="stylesheet">
    <link href="//cdn.bootcss.com/jqueryui/1.11.3/jquery-ui.theme.min.css" rel="stylesheet">
    <script src="http://cdn.bootcss.com/jquery/1.11.2/jquery.min.js"></script>
    <script src="//cdn.bootcss.com/jqueryui/1.11.3/jquery-ui.min.js"></script>
    <script src="${pageContext.request.contextPath}/js/article/article.js"></script>
<style>
    html,body{margin:0px;height:100%;}
	ul {height:95%; width:200px; list-style-type:none; float:left; overflow:auto; padding:0px; margin:0px; background: #EEF1F5;}
	li {cursor:hand; margin:5px; font-size:16px; width: 170px; height: 22px;}
    li[title]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
	fieldset {height: 95%; border: 1px solid #F1F1F1; margin-right: 40px; display:inline;}
	fieldset legend{text-align:left;}
	div {text-align:center; }
	#title {line-height:40px; font-size:20px; font-weight: bold;}
	#container {height:80%;}
	#toolbar {line-height:40px; }
	.group_id_ctrl {width: 15px; float: left; text-align:center; margin:10px;}
	.group_id_ctrl span {cursor:pointer; width: 15px; height: 15px; margin-bottom: 15px;}
	.ui_state_default{border: 1px solid #d3d3d3; background: #e6e6e6; font-weight: normal; color: #555555;}
    .checkedColor {background: #848484;}
    .ui-button{height:30px;}
    .cell_lable{background-color: #d0dce9;color:#02236e;}
    .ui-selected{background:#848484;}
    .sortableUl{display:inline;}
    .ui-widget-overlay {position: fixed;}
    .placeholderhelper{border:1px solid #848484;background:#848484}
    .transporter li{display: block;float: none;cursor: default;width: 170px;height: 22px;margin-right: 8px;background: #848484;text-align: center;border: 1px solid darkgray;}
</style>
<script type="text/javascript">
    var classifyAll = <s:action name="classify_queryAll" namespace="/article" executeResult="true"/>;
    var allClassify = classifyAll.allClassify;
    var defualt_articles = allClassify[0].articles;
</script>
</HEAD>
<BODY>
    <div id="title">分类管理</div>
    <div id="container">
        <fieldset>
            <legend>分类项</legend>
            <ul id="classifyName"></ul>
            <div class="group_id_ctrl">
                <span class="plus ui-icon ui-icon-plusthick" onclick="add();"></span>
                <span class="minus ui-icon ui-icon-minusthick" onclick="del();"></span>
            </div>
            
        </fieldset>
        <div class="sortableUl">
            <fieldset>
                <legend>已分类</legend>
                <ul id="chooseItems" class="connectUl"></ul>
            </fieldset>
            <fieldset>
                <legend>默认分类</legend>
                <ul id="noChooseItems" class="connectUl"></ul>
            </fieldset>
        </div>
    </div>
    <div id="toolbar">
        <button type="button" onclick="save();">保存</button>&nbsp;&nbsp;&nbsp;
        <button type="button" onclick="javascript:history.back(-1);">返回</button>
    </div>
    
    <div id="addGroupDialog" title="新增分组">
    <form>
        <br>
        <span style="display:block;">
            分类ID:
            <input type="text" id="classify_id"  class="text ui-widget-content ui-corner-all">
        </span>
        <br>
        <span>
            分类名称:
            <input type="text" id="classify_name"  class="text ui-widget-content ui-corner-all">
        </span>
    </form>
    </div>
    <%@include file="/jsp/waitbg.jsp"%>
</BODY>
</HTML>
